<template lang="">
    <div>
            <a-table
              rowKey="id"
              style="margin-top: 10px"
              :columns="headColumns"
              :data-source="orderDataSource"
              :pagination="pagination"
              @change="handleTableChange"

              :row-selection="{
              selectedRowKeys: orderSelectedRowKeys,
              onChange: orderOnSelectChange,
              type: 'radio',
            }"
            >
            </a-table>
            <a-table
              style="margin-top: 10px"
              :columns="showgoods_columns"
              :locale="{ emptyText }"
              :data-source="ListDataSource"

                :row-selection="{
              selectedRowKeys: listSelectedRowKeys,
              onChange: listOnSelectChange,
            
            }"
            >
            </a-table>
        
    </div>
</template>
<script>
import { CaiGouRuKuHttp } from "@/services/modules/RuKuGuGuanLi/CaiGouRuKu";
const cgrkHttp = new CaiGouRuKuHttp(); // 采购入库

const showgoods_columns = [
  {
    title: "序号",
    align: "center",
    dataIndex: "key",
    key: "key",
  },
  {
    title: "存货编码",
    dataIndex: "inventoryNo",
    key: "inventoryNo",
    align: "center",
  },
  {
    title: "存货名称",
    dataIndex: "inventoryName",
    key: "inventoryName",
    align: "center",
  },
  {
    title: "规格型号",
    dataIndex: "specificationsModel",
    key: "specificationsModel",
    align: "center",
  },
  {
    title: "单位",
    dataIndex: "unit",
    key: "unit",
    align: "center",
  },
  {
    title: "申请采购数量",
    dataIndex: "applyNumber",
    key: "applyNumber",
    align: "center",
  },
  {
    title: "实有库存数量",
    dataIndex: "actualNumber",
    key: "actualNumber",
    align: "center",
  },
  {
    title: "建议采购数量",
    dataIndex: "suggestNumber",
    key: "suggestNumber",
    align: "center",
  },
  {
    title: "用途说明",
    dataIndex: "usageDescription",
    key: "usageDescription",
    align: "center",
  },
  {
    title: "备注",
    dataIndex: "remark",
    key: "remark",
    align: "center",
  },
  {
    title: "采购部备注",
    dataIndex: "purchaseDepartmentRemark",
    key: "purchaseDepartmentRemark",
    align: "center",
  },
  {
    title: "采购员",
    dataIndex: "purchaser",
    key: "purchaser",
    align: "center",
  },
 
];
const headColumns = [
  //外购订单
  {
    title: "序号",
    dataIndex: "key",
    align: "center",
    scopedSlots: { customRender: "key" },
  },
  {
    title: "提交日期",
    dataIndex: "submitTime",
    align: "center",
  },
  {
    title: "文件编号",
    dataIndex: "fileNumber",
    align: "center",
    scopedSlots: { customRender: "fileNumber" },
  },
  {
    title: "文件标题",
    dataIndex: "fileTitle",
    align: "center",
    scopedSlots: { customRender: "fileTitle" },
  },
  {
    title: "提交部门",
    dataIndex: "draftDepartment",
    align: "center",
    scopedSlots: { customRender: "draftDepartment" },
  },
  {
    title: "提交人",
    dataIndex: "submitter",
    align: "center",
    scopedSlots: { customRender: "submitter" },
  },
];
export default {
  data() {
    return {
      layout: {
        labelCol: { span: 5 },
        wrapperCol: { span: 15 },
      },
      //表格相关
      emptyText: "选择源单生成",
      showgoods_columns,
      headColumns,

      orderSelectedRowKeys: [], // 订单选择
      listSelectedRowKeys: [], // 存货选择

      orderDataSource: [],
      ListDataSource: [],

      //分页 查询相关
      queryCache: "",

      pagination: {
        total: 0,
        current: 1,
        pageSize: 5, //每页中显示5条数据
        showSizeChanger: true,
        pageSizeOptions: ["5"], //每页中显示的数据
        showTotal: (total) => `共有${total}条数据`, //分页中显示总的数据
      },
    };
  },
  mounted() {
    this.getPurchaserequest();
  },
  methods: {
    // 搜索
    Search() {
      // let { } = this.searchForm;

      let query = "";

      this.queryCache = query;
      this.pagination.current = 1;
      this.pagination.total = 0;
      this.pagination.pageSize = 5;
      this.getPurchaserequest(query);
    },
    //获取外购入库生成采购入库列表
    getPurchaserequest() {
      let _query = "?";
      _query += `pageNo=${this.pagination.current}`;
      _query += `&pageSize=${this.pagination.pageSize}`;
      _query += `&isTransfer=1`;

      cgrkHttp.getPurchaserequest(_query).then((res) => {
        this.pagination.current = Number(res.result.current);
        this.pagination.total = Number(res.result.total);
        this.pagination.pageSize = Number(res.result.size);

        let _data = res.result.records;
        _data.forEach((item, index) => {
          item.key = (res.result.current - 1) * 5 + index + 1;
        });

        this.orderDataSource = _data;
      });
    },
    // 表格选择事件,
    // jerry-fix:
    // 外购入库生成采购入库 - 上面表格的选中事件
    orderOnSelectChange(selectedRowKeys, selectedRows) {
      console.log(selectedRowKeys);
      console.log(selectedRows);
      this.orderSelectedRowKeys = selectedRowKeys;
      this.orderselectedRows = selectedRows;

      let id = selectedRows[0].purchaseRequestId;
      cgrkHttp.getPurchaserequestinfo("?id=" + id).then((res) => {
        console.log("采购入库根据源单生成表格选择事件res", res);
        let _data = res.result.object.purchaseGoodsList;
        _data.forEach((item, index) => {
          item.key = index + 1;
        });
        this.ListDataSource = _data;
      });
    },

     // 列表选择事件 rain:fix 重新进行直接赋值
    listOnSelectChange(selectedRowKeys, selectedRows) {
      console.log("下面的表格 selectedRows changed: ", selectedRows); //选中的数据
        this.listSelectedRowKeys = selectedRowKeys;

    },
    // 分页函数
    handleTableChange(pagination) {
      this.pagination.current = pagination.current;
      this.pagination.pageSize = pagination.pageSize;
      this.getPurchaserequest(this.queryCache);
    },
  },
};
</script>
<style lang="">
</style>